<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<!DOCTYPE html>
<html>
<head>
    <title>总结管理</title>
    <base href="<%=basePath %>"/>
    <link rel="stylesheet" href="assets/css/bootstrap.css"/>
    <%--<link rel="stylesheet" href="assets/layui/css/layui.css">--%>
    <script src="assets/js/jquery.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <script src="assets/js/jquery.validator.min.js"></script>
    <script src="assets/layui/layui.all.js"></script>

</head>
<body>
<div class="container">
    <div class="col-lg-10 col-lg-offset-1">
        <div class="panel-body">
            <form id="selectForm" class="form-horizontal">
                <div class="panel-body">
                    总结名：<input calss="form-group-sm input" type="text" name="abbreviation">
                    <a class="btn-primary btn-sm" onclick="getSummarys(1)">搜索</a>
                </div>
            </form>
        </div>
        <div>
            <table class="table table-hover table-bordered <%--table table-border table-bordered table-hover table-bg table-sort--%>">
                <thead>
                <tr class="text-c">
                    <th width="80" style="text-align: center">总结名</th>
                    <th width="100" style="text-align: center">内容</th>
                    <th width="100" style="text-align: center">操作</th>
                </tr>
                </thead>
                <tbody style="text-align: center" id="summaryTbody">
                <tr class="text-c">
                    <td colspan="3">
                        加载中。。。
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
        <div style="float: left">
            <a class="btn-primary btn-sm" data-toggle='modal' data-target='#addModal'>新增总结</a>
        </div>
        <div id="page" style="float: right">
            总共1页，当前第1页，一页5行，总共0行。
            <a class="btn-sm btn-primary" onclick="getSummarys(1)">上一页</a>
            <a class="btn-sm btn-primary" onclick="getSummarys(1)">下一页</a>
        </div>
    </div>
</div>
<div class="modal fade" id="addModal">
    <div class="modal-dialog" style="width: 600px">
        <div class="modal-content">
            <!-- 模态框头部 -->
            <div class="modal-header" style="text-align: center">
                <label>新增总结</label>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body" style="overflow:auto">
                <form id="addForm" class=" form-horizontal col-lg-offset-2">
                    <table>
                        <tr>
                            <td>总结名：</td>
                            <td><input class="form-control" type="text" name="abbreviation" id="abbreviation" onblur="nonEmpty(this.id,'建议名')"></td>
                        </tr>
                        <tr>
                            <td>内容：</td>
                            <td><textarea class="form-control" type="text" name="content" id="content" onblur="nonEmpty(this.id,'内容')" style="width: 500px"></textarea></td>
                        </tr>
                    </table>
                </form>
            </div>
            <div class="modal-footer">
                <a class="btn-primary btn-sm" onclick="addSummary()">添加</a>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="detailsModal">
    <div class="modal-dialog" style="width: 600px">
        <div class="modal-content">
            <!-- 模态框头部 -->
            <div class="modal-header" style="text-align: center">
                <label>总结详情</label>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body" style="overflow:auto">
                <form id="detailsForm" class=" form-horizontal col-lg-offset-2">
                    加载中。。。
                </form>
            </div>
            <div class="modal-footer">
                <a class="btn-primary btn-sm" onclick="updateSummary()">保存修改</a>
            </div>
        </div>
    </div>
</div>

</body>
</html>
<script>
    $(document).ready(function () {
        //搜索总结列表
        getSummarys(1);
    });

    function getSummarys(pageNum) {
        if (pageNum!=0) {
            $.post(
                "summary/getSummarys.action?pageNum="+pageNum,
                $('#selectForm').serialize(),
                function (summarys) {
                    if (summarys.list.length == 0) {
                        $('#summaryTbody').html(null);
                        $('#summaryTbody').append(
                            "<tr>" +
                            "<td colspan='3'>没有符合条件的数据</td>" +
                            "</tr>"
                        );
                    } else {
                        $('#summaryTbody').html(null);
                        var str ;
                        summarys.list.forEach(function (v) {
                            str += "<tr><td>" + v.abbreviation + "</td>" +
                                "<td>" + v.content + "</td>" +
                                "<td><a class='btn-primary btn-sm' data-toggle='modal' data-target='#detailsModal' onclick='details("+v.summaryId+")'>详情</a> " +
                                    "<a class='btn-primary btn-sm'onclick='del("+v.summaryId+")'>删除</a>"+
                                "</td></tr>"
                        });
                        $('#summaryTbody').append(str);
                    }
                    $('#page').html(null);
                    $('#page').append("总共" + summarys.pages + "页，当前第" + summarys.pageNum + "页，一页" + summarys.pageSize + "行，总共" + summarys.total + "行。");
                    $('#page').append("<a class='btn-sm btn-primary' onclick='getSummarys(" + summarys.prePage + ")'>上一页</a> ");
                    $('#page').append("<a class='btn-sm btn-primary' onclick='getSummarys(" + summarys.nextPage + ")'>下一页</a>");

                }
            )
        }
    }

    function addSummary() {
        if (nonEmpty('abbreviation',"总结名")) {
            if (nonEmpty('content',"内容")) {
                $.post(
                    "summary/addSummary.action",
                    $('#addForm').serialize(),
                    function (str) {
                        if (str=="true") {
                            alert("添加成功！");
                        }else {
                            alert("添加失败！");
                        }
                    }
                )
            }
        }
    }

    //修改建议
    function updateSummary() {
        if (nonEmpty('abbreviation1',"总结名")) {
            if (nonEmpty('content1',"内容")) {
                $.post(
                    "summary/updateSummary.action",
                    $('#detailsForm').serialize(),
                    function (str) {
                        if (str=="true") {
                            alert("修改成功！");
                        }else {
                            alert("修改失败！");
                        }
                    }
                )
            }
        }
    }

    //详情
    function details(SummaryId) {
        $.post(
            "summary/getSummary.action",
            {'SummaryId':SummaryId},
            function (data) {
                var str = "<table><tr>"+
                    "<td>建议名：</td>"+
                    "<td><input class='form-control' type='text' name='abbreviation' id='abbreviation1' value='"+data.abbreviation+"'></td>" +
                    "</tr><tr>"+
                    "<td>内容：</td>"+
                    "<td><textarea class='form-control' type='text' name='content' id='content1' style='width: 500px;height: 150px'>"+data.content+"</textarea></td>" +
                    "</tr></table>"+
                    "<input hidden name='summaryId' value='"+data.summaryId+"'>"
                $('#detailsForm').html(null);
                $('#detailsForm').append(str);
            }
        )
    }

    function del(summaryId) {
        if (confirm("确认删除?")) {
            $.post(
                "summary/delSummary.action",
                {'summaryId': summaryId},
                function (data) {
                    if (data == "true") {
                        alert("删除成功！");
                        getSummarys(1);
                    } else {
                        alert("删除失败！");
                        getSummarys(1);
                    }
                }
            )
        }
    }

    //前端非空验证（标签ID，提示语）
    function nonEmpty(input, tips) {
        var inputval = $("#" + input).val();
        if (!inputval) {
            layer.tips('请输入'+tips+'!', '#' + input, {tips: [2, '#CC3333']});
            return false;
        }
        return true;
    }

    //关闭模态框后
    $('#detailsModal').on('hidden.bs.modal', function () {
        getSummarys(1);
    })
    $('#addModal').on('hidden.bs.modal', function () {
        getSummarys(1);
        $('#abbreviation').val(null);
        $('#content').val(null);
    })


</script>